import React, { useState, useEffect } from 'react'
import { bannerQuery } from './sevice/bannarQuery'
import { useNavigate } from 'react-router-dom'

//轮播图组件
import Banner from './component/LifeBanner'
//图片点击展示区
import Pay from './view/Pay'
import { NavBar } from 'react-vant'
export default function Home() {
  const navigate = useNavigate();

  let [bannerList, setbannerList] = useState([])

  useEffect(() => {
    (async () => {
      let { data } = await bannerQuery()
      setbannerList(data.rows)
    })()
  }, [])

  return (
    <div style={{ background: '#F7F7F9' }}>
      <NavBar
        title="生活缴费"
        leftText="返回"
        onClickLeft={() => navigate("/")}
      />
      <Banner list={bannerList}></Banner>
      <Pay></Pay>
    </div>
  )
}
